import React, { Component } from 'react'
import { Switch, Redirect } from 'react-router'
import { PrivateRoute } from 'components/route'
import BasicConfig from './basic'
import ClassConfig from './classes'
import TagConfig from './tags'
import Nav from './configNav'

export default class Org extends Component {
  state = { activeItem: '' }

  componentDidMount = () => {
    const { setParentActiveItem } = this.props
    setParentActiveItem('config')
  }

  setActiveItem = item => this.setState({ activeItem: item })

  render() {
    const { location, match, project } = this.props
    const { activeItem } = this.state
    return (
      <React.Fragment>
        <Nav activeItem={activeItem} project={project} />
        <Switch location={location}>
          <Redirect exact path={`${match.url}`} to={`${match.url}/basic`} />
          <PrivateRoute
            path={`${match.url}/basic`}
            render={props => (
              <BasicConfig {...props} setParentActiveItem={this.setActiveItem} project={project} />
            )}
            exact
          />
          <PrivateRoute
            path={`${match.url}/class`}
            render={props => (
              <ClassConfig {...props} setParentActiveItem={this.setActiveItem} project={project} />
            )}
            exact={false}
          />
          <PrivateRoute
            path={`${match.url}/tag`}
            render={props => (
              <TagConfig {...props} setParentActiveItem={this.setActiveItem} project={project} />
            )}
            exact={false}
          />
          <Redirect from="*" to={`${match.url}`} />
        </Switch>
      </React.Fragment>
    )
  }
}
